<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    
</head>
<body>
        <h2>大小写转换</h2>
        原数据：<input type="text" id="old">
       <P>操作：
        <input type="button" value="转大写" onclick="deal('upper')">
        <input type="button" value="转小写" onclick="deal('lower')"></P>
         <p>新数据：<input type="text" id="new"></p>
        <script>
            function deal(opt) {
                var str = document.getElementById('old').value;
                switch (opt) {
                    case 'upper':
                        str = str.toUpperCase();
                        break;
                    case 'lower':
                        str =str.toLowerCase();
                        break;
                }
                document.getElementById('new').value = str;
            }

        </script>
        </body>
</html>